首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • 来自专栏CSDNToQQCode

    ubuntu安装ruby、安装sass

    目录 1、安装【ruby】 2、安装sass 3、Scss编译测试 1、安装【ruby】 sudo apt-get install ruby sudo apt-get install ruby-dev 需要【确认】下载 可以通过【ruby -v 】查看版本 ruby -v 2、安装sass sudo gem install sass 包有点大,下载的慢一些。    如下下载完成: 查看sass版本 sass -v 3、Scss编译测试 vim style.scss $a:500px; $b:500px; $c:45px; $color:skyblue; body

    2.2K20编辑于 2022-11-29
  • 来自专栏神光的编程秘籍

    继往开来的 sass 3 代编译器:ruby sass、node-sass、dart-sass

    ruby sass sass 最早是 2006 年由 ruby 开发的,作为和它 web 框架的模版引擎 haml 配套的编写 css 的语言。因为比较好用,所以前端也都在用。 sass 编译器是用 ruby 开发的,而 ruby 是一门解释型语言,所以前端开发想编译 sass 就需要在本地安装 ruby。 而且 node-sass 是用 c++ 写的,编译速度比 ruby sass 快很多。 三代 sass 编译器 介绍完了三代编译器,我们来简单做下回顾: ruby sass 是最早的 sass 编译器,用 ruby 写的,所以不能被 node 调用,但是它是开创者,历史功绩列第一位。 ruby sass 和 node-sass 都已经是历史,dart-sasssass 编译器的未来。

    2.2K10编辑于 2022-03-03
  • 来自专栏landv

    warning insecure world writable dir ruby mode 040777,gem insstal sass error failed to build gem nati

    gem install sass Building native extensions. 继续安装sass(我叫他洒洒水) ? 安装成功,查看一下是否安装成功 landv@Desktop201712556489:~/node$ sass -v bash: sass: 未找到命令 landv@Desktop201712556489 直接吧npm下载到的node-sass加入环境变量 综上所述,那就是卸载ruby再进行安装配置,如果还不行那就再卸载一边。 报这个错误就执行 sudo gem install cocoapods-core 然后再安装sass 记住千万不要用deepin自带的ruby 重要的事情不怕多说 sudo apt-get install

    1.8K20发布于 2019-05-23
  • 来自专栏生如夏花绚烂

    Sass学习(一)--Sass入门

    目录 常用命令 变量 嵌套css规则 群组选择器 子选择器,相邻,同级选择器 属性嵌套 import导入 嵌套导入 sass注释 sass乱码解决 常用命令 sass 命令 sass input.scss output.css :将sass文件输出到指定css文件 sass --watch input.scss:output.css:自动监视sass文件更新到指定css文件 sass --watch app /sasss:public/styles:sass监视一个目录里面的sass文件更新到指定目录 sass --update /sass:/css:将一个文件夹的所有scss文件编译到另一个一个目录 sass 文件,但某个sass文件可能会跟我当前的sass文件类名冲突,这时候可能会优先执行被导入sass文件的样式 //a.scss $themeColor:red; //b.scss $themeColor =Encoding.find('utf-8') 我的sass目录 E:\Ruby27-x64\lib\ruby\gems\2.7.0\gems\sass-3.7.4\lib\sass

    2.1K10编辑于 2022-09-08
  • 来自专栏『学习与分享之旅』

    Sass导入其它Sass文件

    和 LESS 一样 SASS 文件中也支持导入其它 SASS 文件,其实原生的 CSS 也支持通过 @import 导入其它的 CSS 文件,只不过不常用,不常用的原因在于原生的 @import 导入其它的 CSS 文件,只有执行到 @import 时浏觅器才会去下载对应 CSS 文件,这导致请求次数变多,页面加载起来特别慢,而 LESS 和 SASS 中的 @import 是直接将导入的文件拷贝到当前文件中生成一份

    66920编辑于 2023-09-29
  • 来自专栏河湾欢儿的专栏

    sass

    只是方便我们开发用的,最终我们需要把他们编译成正常的css,浏览器识别css Sass 是采用 Ruby 语言编写的一款 CSS 预处理语言,它诞生于2007年,是最大的成熟的 CSS 预处理语言。 sass安装 在 Windows 平台下安装 Ruby 需要先有 Ruby 安装包,大家可以到 Ruby 的官网(http://rubyinstaller.org/downloads)下载对应需要的 Ruby 版本。 当你的电脑中安装好 Ruby 之后,接下来就可以安装 Sass 了。只需要在你的命令终端输入一行命令即可。 版本 gem uninstall sass//卸载sass(不要点) ws配置路径:program:C:\Ruby23-x64\bin\sass.bat mixin @mixin alert($color

    2K10发布于 2018-09-06
  • 来自专栏FreeSWITCH中文社区

    Sass

    如果你用了打包工具,比如Gulp、Webpack,又需要写比较多的样式的话,那用Sass来写CSS才是最好不过的。 相比较CSS,Sass能提供很多CSS无法达到的优越性。 sass的出现,让前段样式写起来更有结构。各种原因就是,CSS那么难用你怎么还在用CSS。 Sass让前端样式拥有了变量 CSS本身是缺少变量机制的,像每个网站都有自己的主色,如果没有变量的话,只写CSS,每次都只能拷贝颜色六位数,但有了变量就不一样了。就是在Sass底下。 使用时,只要对变量进行声明和引用即可,需要注意的一点是,在Sass中符号中划线和下划线是相同的。即a_b和a-b是相同的。 color: $nav-color; } Sass可以解决CSS的无层级嵌套 同样的代码,Sass可以在书写时将次级元素嵌套在上一级元素之间。

    1.6K10发布于 2020-12-21
  • 来自专栏404

    node-sass update to dart-sass

    // 卸载 node-sass npm uninstall node-sass // 安装 dart-sass npm install sass sass-loader -D 如果项目之前用到/deep /需要替换为::v-deep,否则会报错,全局搜索 /deep/ , 将项目里的 /deep/ 替换为 ::v-deep 弃用node-sass的理由: node-sass在npm安装的时候大概率的会安装出错 ,或下载时间过长 node-sass已停止更新 node-sass与dart-sass区别: node-sass 是用 node(调用 cpp 编写的 libsass)来编译 sass dart-sass 是用 drat VM 来编译 sass node-sass是自动编译实时的,dart-sass需要保存后才会生效 推荐 dart-sass 性能更好(也是 sass 官方使用的),而且 node-sass

    1.3K20编辑于 2022-04-25
  • 来自专栏网络收集

    编译sass

    sass安装 Ruby自带一个叫做RubyGems的系统,用来安装基于Ruby的软件。我们可以使用这个系统来 轻松地安装Sass和Compass。 要安装最新版本的Sass和Compass,你需要输入下面的命令: //安装如下(如mac安装遇到权限问题需加 sudo gem install sass) gem install sass gem install 命令帮助等命令: //更新sass gem update sass //查看sass版本 sass -v //查看sass帮助 sass -h 编译sass sass编译有很多种方式,如命令行编译模式 、sublime插件SASS-Build、编译软件koala、前端自动化软件codekit、Grunt打造前端自动化工作流grunt-sass、Gulp打造前端自动化工作流gulp-ruby-sasssass文件的目录,你也可以告诉sass监听整个目录: sass --watch app/sass:public/stylesheets 命令行编译配置选项; 命令行编译sass有配置选项,如编译过后css

    1.1K20编辑于 2022-05-13
  • 来自专栏全栈开发工程师

    Sass学习笔记】001-Sass简介

    一、Sass简介 1 什么是 CSS 预处理器 我们来编写 Sass 代码,Sass 代码再转换成标准的 CSS 代码! 2.2 Sass 前世今生 Sass 是最早的 CSS 预处理语言,有比 LESS 更为强大的功能,不过其一开始的缩进式语法(Sass 老版本语法,后面课程会详细介绍 )并不能被大众接受,不过由于其强大的功能和 Ruby on Rails 的大力推动,还是有很多开发者选择了 SassSass 是采用 Ruby 语言编写的一款 CSS 预处理语言,它诞生于2007年,是最大的成熟的 CSS 预处理语言。 4.1 Sass 和 CSS 写法有差别 Sass 和 CSS 写法的确存在一定的差异,由于 Sass 是基于 Ruby 写出来,所以其延续了 Ruby 的书写规范。

    76610编辑于 2025-01-06
  • 来自专栏全栈开发工程师

    Sass学习笔记】002-Sass 环境安装

    二、Sass 环境安装 1 Sass安装(windows版) 1.1 安装 Ruby 第一步:下载 Ruby 安装包 **中文官网:**http://www.ruby-lang.org/zh_cn/ * *中文文档地址:**http://www.ruby-lang.org/zh_cn/documentation/ **linux 版本下载地址:**http://www.ruby-lang.org/zh_cn https://rubyinstaller.org/downloads/ 选择 WITH DEVKIT 下面的版本进行下载,慕课教程建议安装在 C 盘,勾选 ”Add … PATH“ 第二步:安装 Ruby 第三步(选):通过命令安装 Sass 在开始菜单找到 Start Command Prompt with Ruby ,并打开(cmd窗口) 打开电脑的命令终端,输入下面的命令: gem install gem sources -l 返回结果如下: *** CURRENT SOURCES *** https://ruby.taobao.org 请确保只有 ruby.taobao.org。

    78310编辑于 2025-01-06
  • 来自专栏三木的博客

    sass 概要

    好在有了sass,写css不再死板。sass对css的增强如下: 宏定义 宏定义的优点在于一处定义,多处使用,需要修改的时候只需要修改定义的地方即可。 虽然sass没有明确的说明,但其实以下几种语法与C语言中的宏定义非常类似: 变量 sass中的变量适用于替换css中参数的值。 border-radius: if($rounded-corners, 5px, null); } css: .button { border: 1px solid black; } sass 以下划线开头的文件类似于子模块,不会被被sass编译为css,只能被其他scss文件引用。 对css所做的一些增强,阐明了sass如何让css从简单的平铺式的书写方式演变成一种"编程语言",希望读者可以在自己的前端项目中试一试sass,相信它会极大地提升你的开发效率。

    1.4K10发布于 2020-02-18
  • 来自专栏网络收集

    Sass学习

    2、什么是SassSass是功能最为强大、最成熟、并且是最为流行的CSS预处理器。因此,对于Sass、Less和Stylus这3个,我们还是建议大家学习Sass。 但是两者也有以下明显区别: (1)Sass由于是使用Ruby编写的,所以编译的时候是在服务器端处理;而Less由于是使用JavaScript编写的,所以编译的时候是在浏览器端处理; (2)Sass拥有更为强大的功能 4、Sass和Scss 在Sass中,有2种语法格式: (1)Sass格式; (2)Scss格式。也就是说,平常我们所说的Sass和Scss其实是同一个东西来的,统称为SassSass和Scss仅仅是Sass的两种语法格式罢了。 一、Sass格式 Sass格式,是Sass的“旧版本语法”。 这种语法格式,不使用大括号“{}”和分号“;”,而是使用严格的缩进式语法规则来书写,也就是类似Ruby语言的写法。

    1K50编辑于 2022-04-17
  • 来自专栏Elixir

    Ruby Programming | 连载 03 - Ruby 对象基础

    一、Ruby 对象 Ruby 中所有的数据结构和值都是对象,包括基本的数字和字符串以及数组 Array、散列表 Hash 这样的复杂数据结构。 Ruby 的动态特性之一 Ruby 对象可以拦截位置的消息并使他们拥有具体的含义,Rails 框架中大量使用了拦截,发送位置的消息到对象并拦截该消息,然后能够在使用当前数据库表的列名作为动态条件的情况下顺畅运行 Ruby 中类的概念没有对象重要,Ruby 作为一种动态解释型语言,对象在实例化过程中是可以改变的,对象可以在实例化过程中改变类中定义的行为或者增加原类中没有定义的行为,这就是 Ruby 语言的动态特性 二、第一个 Ruby 程序 接下来将编写一个简单的汇率换算的工具,使用 Ruby 的面向对象特性来实现。 Ruby 程序需要通过 Ruby 解释器来执行,该解释器名为 ruby,在代码文件目录下执行命令: ruby exchange.rb 输入兑换的人民币金额 2000,输出可兑换的澳币金额为: 输入要兑换的人民币金额

    3.3K20编辑于 2022-10-05
  • 来自专栏Elixir

    Ruby Programming | 连载 02 - Ruby 语法基础

    一、Ruby 基本语法 Ruby 的基本语法中包含了 Ruby 的基本运算符、I/O、控制流以及 Ruby 中的特殊对象和注释。 Ruby 是一门面向对象的编程语言,Ruby 中一切皆对象。Ruby 语言中包含的特殊对象如下: 操作 栗子 说明 默认对象 self self 关键字引用默认对象。 二、Ruby 标识符 Ruby 中的标识符类型不多,主要包含了 变量, 常量, 关键字, 方法名 等,而变量又包含了局部变量, 全局变量, 实例变量 和 类变量。 但是在组合单词命名的局部变量时,Ruby 通常约定使用下划线来作为命名规范,而不是驼峰命名法;Ruby 中推荐使用 first_name 而不是 firstName。 方法命名规范 Ruby 中的方法名的命名与局部变量的命名规则一致,但是 Ruby 中的一些方法名中包含了特殊字符,如 ?, !

    6.8K10编辑于 2022-09-28
  • 来自专栏全栈程序员必看

    Ruby On Rails 4 hello world,Ruby On Rails上手

    能够用 \curl -L https://get.rvm.io | bash -s stable 查看rails版本号 rails -v Rails 4.0.3 似乎这就是当前的最新版本号 Ruby 版本号 We recommend Ruby 2.1.0 for use with Rails. We stopped supporting Ruby 1.8.x after Rails 3.2. Ruby 1.9.2+ will be supported until Rails 5. sprockets (2.11.0) Using sprockets-rails (2.0.1) Using rails (4.0.3) Using rdoc (4.1.1) Using sass (3.2.19) Using sass-rails (4.0.3) Using sdoc (0.4.0) Using sqlite3 (1.3.9) Using turbolinks

    5.3K20编辑于 2022-07-12
  • 来自专栏网络收集

    Sass安装

    5、Sass安装 NPM 安装 我们可以使用 npm(NPM 使用介绍)来安装 Sass。 来安装: choco install sass Mac OS X (Homebrew)安装 Mac OS 可以使用 Homebrew 包管理器来安装: brew install sass/sass /sass 更多安装方法可以查看官网:https://sass-lang.com/install 安装Sass和Compass sass基于Ruby语言开发而成,因此安装sass前需要安装Ruby (注:mac下自带Ruby无需在安装Ruby!) window下安装SASS首先需要安装Ruby,先从官网下载Ruby并安装。 如下图: 安装完成后需测试安装有没有成功,运行CMD输入以下命令: ruby -v //如安装成功会打印 ruby 2.6.4p104 (2019-08-28 revision 67798) [

    2.6K40编辑于 2022-05-13
  • 来自专栏网络收集

    编译sass

    编译sass sass编译有很多种方式,如命令行编译模式、sublime插件SASS-Build、编译软件koala、前端自动化软件codekit、Grunt打造前端自动化工作流grunt-sass、Gulp 打造前端自动化工作流gulp-ruby-sass等。 命令行编译; //单文件转换命令 sass input.scss output.css //单文件监听命令 sass --watch input.scss:output.css //如果你有很多的sass 文件的目录,你也可以告诉sass监听整个目录: sass --watch app/sass:public/stylesheets 命令行编译配置选项; 命令行编译sass有配置选项,如编译过后css排版 //编译格式 sass --watch input.scss:output.css --style compact //编译添加调试map sass --watch input.scss:output.css

    79140编辑于 2022-04-18
  • 来自专栏技术社区

    了解sass

    一、变量 所有变量以$开头 $font_size: 12px; .container{ font-size: $font_size; } 如果变量嵌套在字符串中,需要写在#{}中 $side : left; .rounded { border-#{$side}: 1px solid #000; } 二、嵌套 层级嵌套 .container{ display: none; .header{ width: 100%; } } 属性嵌套,注意,border后

    77920编辑于 2022-06-16
  • 来自专栏秋风的笔记

    Node Sass 弃用,以 Dart Sass 代替

    就在今天,Sass 官方团队正式宣布 Libsass 将弃用,以及基于它的 Node Sass 和 SassC,并且建议用户使用 Dart SassSass 做一个基准测试。 之后 Node Sass 还维护吗? Dart Sass 能满足我们的需求吗? Dart Sass 的性能如何? Dart Sass 带来的好处和坏处。 Dart Sass Dart Sass 可以编译为纯 JavaScript 编写的 sass 软件包上传到 npm 。 Dart Sass 纯 JS 的方式也可以让我们摆脱被 Node Sass 编译支配的恐惧,不用再担心 Node Sass 安装不成功的问题了,并且 Dart Sass 也在积极地处理它的性能问题。

    4.9K10发布于 2020-11-09
领券